<template>
	<uni-card title="订单信息">
		<view class="fileMessage">
			<view class="fileImage">
				<image src="../../../static/file.png" mode="aspectFill"></image>
			</view>
			<view class="fileNameGroup">
				<view class="fileName">
					附件1：论文（设计）检测操作指南（简易文字版）.docx
				</view>
				<view class="fileName2">
					文件/黑白/A4
				</view>
			</view>
		</view>
		<view class="borderImage"></view>
		<view class="fileSettinggroup">
			<view class="filePreview">
				<image src="../../../static/preview.png" mode="aspectFill"></image>
			</view>
			<view class="fileSetting" @click="toggle('bottom')">
				<image src="../../../static/setting.png" mode="aspectFill"></image>
			</view>
			<uni-popup ref="popup" :type="type" :animation="false" :maskClick="true">
				<view class="popupStyle">
					<view class="paper">
						<view class="paper-text">纸型</view>
						<view class="paper-button">A4</view>
					</view>
					<view style="border: 1rpx solid #EFEFF4;"></view>
					<view class="paper">
						<view class="paper-text">颜色</view>
						<view class="paper-button">黑白</view>
					</view>
					<view style="border: 1rpx solid #EFEFF4;"></view>
					<view class="paper">
						<view class="paper-text">单双</view>
						<view class="double-select">
							<view class="paper-button">单面</view>
							<view class="paper-button">双面</view>
						</view>
					</view>
					<view style="border: 1rpx solid #EFEFF4;"></view>
					<view class="paper">
						<view class="paper-text">份数</view>
						<uni-number-box @change="changeValue"></uni-number-box>
					</view>
					<view style="border: 1rpx solid #EFEFF4;"></view>
					<view class="paper">
						<view class="paper-text">范围</view>
						<view class="double-select">
							<view class="paper-button">全部</view>
							<view class="paper-button">自定义</view>
						</view>
					</view>
					<view style="border: 1rpx solid #EFEFF4;"></view>
					<view class="submit-style">
						<button type="primary" @click="submitForm()">确定</button>
					</view>
				</view>
			</uni-popup>
		</view>
	</uni-card>
</template>

<script>
	import {listOrders} from "../../../apis/orders.js"
	import {getToken} from "../../../apis/myCookie.js"	
	export default{
		data(){
			return{
				type:'top'
			}
		},
		methods:{
			
			toggle(type){
				this.type = type;
				this.$refs['popup'].open();
			},
			submitForm() {
				getApp().globalData.myOrder.requireList.push({
						fileId: data.fileName,
						paperColor: 0,
						paperNum: 1,
						paperType: 0,
						rangeEnd: 1,
						rangeStart: 1,
						side: 0,
						id: '',
						orderId: ''
					}
				);
			},
			changeValue(value) {
				console.log('返回数值：', value);
			},
		}
	}
</script>

<style>
	.fileMessage{
		display: flex;
		justify-content: flex-start;
		flex-direction: row;
	}
	.fileImage{
		width: 20rpx;
		
	}
	.fileImage image{
		width: 80rpx;
		height: 80rpx;
	}
	.fileNameGroup{
		margin-left: 80rpx;
	}
	.fileName{
		font-size: 40rpx;
	}
	.fileName2{
		font-size: 30rpx;
	}
	.fileSettinggroup{
		display: flex;
		justify-content: flex-end;
	}
	.filePreview image{
		margin: 10rpx;
		width: 50rpx;
		height: 50rpx;
	}
	.fileSetting image{
		margin: 10rpx;
		width: 50rpx;
		height: 50rpx;
	}
	.borderImage{
		border: 1rpx solid #EFEFF4;
	}
	.popupStyle{
		 background-color: #fff;
		 padding: 15px;
		 height: 800rpx;
		 width: auto;
	}
	.container{
		padding: 0%	;
	}
	.setting-group{
		/* border: 1px solid #000000; */
	}
	.paper{
		/* border: 1px solid red; */
		display: flex;
		justify-content: space-between;
		flex-direction: row;
		height: 100rpx;
	}
	.paper-text{
		/* border: 1px solid yellow; */
		margin: 6rpx;
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	.double-select{
		display: flex;
		justify-content: space-around;
		flex-direction: row;
	}
	.paper-button{
		width: 80rpx;
		height: 60rpx;
		background-color: #10b8ff;
		color: #FFFFFF;
		border-radius: 8rpx;
		margin: 6rpx;
		font-size: 20rpx;
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
		margin: 20rpx;
	}
	.submit-style{
		margin: 40rpx;
		width: 600rpx;
		height: 60rpx;
		/* border-radius: 50rpx; */
		/* border: 1rpx solid ; */
	}
</style>
